<template>
  <div>
    <el-table :data="tableData" border style="width: 100%">
      <el-table-column prop="name" label="号码" width="200" align="center">
      </el-table-column>
      <el-table-column prop="date" label="日期" width="200" align="center">
      </el-table-column>
      <el-table-column prop="name" label="接收人" width="200" align="center">
      </el-table-column>
      <el-table-column prop="address" label="短信内容" align="center">
      </el-table-column>
    </el-table>
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="userQueryForm.pageNum"
      :limit.sync="userQueryForm.pageSize"
    />
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        {
          date: "18230562907",
          name: "任弘盛",
          address:
            "2022年8月11日18点16分，接到相关部门报送，航班HA1233在禄口机场附近正常起飞，请知悉！",
        },
      ],
      userQueryForm: {
        pageNum: 1,
        pageSize: 6,
      },
      total: 0,
    };
  },
  methods: {
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
    },
  },
};
</script>
<style scoped>
.el-pagination {
  margin-top: 10px;
  display: flex;
  justify-content: right;
}
</style>
